<!DOCTYPE html>
<html class="x-admin-sm">

<head>
    <meta charset="UTF-8">
    <title>赛题列表</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
    <link rel="stylesheet" href="../../css/font.css">
    <link rel="stylesheet" href="../../css/xadmin.css">
    <link rel="stylesheet" href="../../css/theme5.css">
    <link rel="stylesheet" href="../../lib/layui/css/layui.css">
    <script src="../../lib/layui/layui.js" charset="utf-8"></script>
    <script type="text/javascript" src="../../js/xadmin.js"></script>
    <!--[if lt IE 9]>
    <script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
    <script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->
    <style>
        .layui-input:focus, .layui-textarea:focus{border-color:#1E9FFF!important}
        .layui-body{overflow-y: scroll;}
        body{overflow-y: scroll;}
        /*.layui-table-cell .layui-form-checkbox[lay-skin="primary"]{*/
        /*    left: 50%;*/
        /*    transform: translateX(-50%);*/
        /*}*/
        /*.layui-table td, .layui-table th {*/
        /*    min-width: 0px;*/
        /*}*/
    </style>
</head>

<body>
<div class="layui-fluid">
    <div class="layui-row layui-col-space15">
        <div class="layui-col-md12">
            <div class="layui-card">
                <div class="layui-card-body ">
                    <!--                    <form class="layui-form layui-col-space5">-->
<!--                    <div class="layui-inline layui-show-xs-block">-->
<!--                        <input class="layui-input" autocomplete="off" placeholder="开始日期" name="start" id="start"></div>-->
<!--                    <div class="layui-inline layui-show-xs-block">-->
<!--                        <input class="layui-input" autocomplete="off" placeholder="截止日期" name="end" id="end"></div>-->
                    <div class="layui-inline layui-show-xs-block">
                        <input id='search_name' type="text" name="username" placeholder="赛题名称" autocomplete="off" class="layui-input" style=""></div>
                    <div class="layui-inline layui-show-xs-block">
                        <button class="layui-btn layui-btn-normal" id='search'>
                            <i class="layui-icon">&#xe615;</i></button>
                    </div>
                    <!--                    </form>-->
                </div>
                <div class="layui-card-body ">
                    <table class="layui-table" id="competition_list" lay-filter="competition_list">
                    </table>
                </div>
            </div>
        </div>
    </div>
</div>
</body>
<script type="text/html" id="toolbarDemo">
    <div class="layui-btn-container">
        <button class="layui-btn layui-btn-danger" lay-event="delAll"><i class="layui-icon">&#xe640;</i>批量删除</button>
        <button class="layui-btn layui-btn-normal" lay-event="add"><i class="layui-icon"></i>新增</button>
        <button class="layui-btn layui-btn-normal" lay-event="refresh"><i class="layui-icon" >&#xe669;</i>刷新</button>
    </div>
</script>
<script type="text/html" id="toolbar1">

    <a title="编辑"  lay-event="edit" >
        <i class="layui-icon">&#xe642;</i>
    </a>
    <a lay-event="del" title="删除" >
        <i class="layui-icon">&#xe640;</i>
    </a>

</script>
<script src="../../lib/jquery.min.js"></script>
<script src="../../js/const.js"></script>
<script src="../../js/util.js"></script>
<script>
    layui.use('laydate',
        function() {
            var laydate = layui.laydate;

            //执行一个laydate实例
            laydate.render({
                elem: '#start', //指定元素
                theme: '#1E9FFF'
            });

            //执行一个laydate实例
            laydate.render({
                elem: '#end', //指定元素
                theme: '#1E9FFF'
            });

        });</script>
<script>
    var competition_data;
    layui.use('table',
        function() {
            var table = layui.table;
            //第一个实例
            tablein = table.render({
                elem: '#competition_list'
                // ,height: 312
                ,url: '/competition_list' //数据接口
                ,page: {theme:'#1e9fff'} //开启分页
                ,toolbar: '#toolbarDemo'
                ,cellMinWidth:48
                ,cols: [[ //表头

                    {checkbox: true, align:'left'}
                    // ,{field: 'id', title: 'ID', minWidth:50, align:'center'}
                    ,{field: 'competitionName', title: '赛题名称', minWidth:50, align:'center'}
                    ,{field: 'competitionDesc', title: '赛题描述', minWidth:80, align:'center'}
                    ,{field: 'dataDesc', title: '数据描述', minWidth:80, align:'center'}
                    ,{field: 'trainDataUrl', title: '训练集地址', minWidth:80, align:'center'}
                    ,{field: 'testDataUrlA', title: 'A榜测试集地址', minWidth:80, align:'center'}
                    ,{field: 'testDataUrlB', title: 'B榜测试集地址', minWidth:80, align:'center'}
                    ,{field: 'startTime', title: '开始时间', minWidth: 20, align:'center',templet: function(d){
                            return d.startTime.replace('T', ' ').split(".")[0];
                        }}
                    ,{field: 'endTimeA', title: 'A榜结束时间', minWidth: 20, align:'center',templet: function(d){
                            return d.endTimeA.replace('T', ' ').split(".")[0];
                        }}
                    ,{field: 'endTimeB', title: 'B榜结束时间', minWidth: 20, align:'center',templet: function(d){
                            return d.endTimeB.replace('T', ' ').split(".")[0];
                        }}
                    ,{field: 'state', title: '状态', minWidth: 20, align:'center',templet: function(d){
                        if(d.state == 0){
                            return '未开始';
                        }
                        if (d.state == 1){
                            return 'A榜进行中';
                        }
                            if (d.state == 2){
                                return 'B榜进行中';
                            }
                            if (d.state == 3){
                                return '已结束';
                            }

                        }}
                    ,{field: 'owner', title: '举办方', minWidth:80, align:'center'}
                    ,{field: 'creator', title: '创建人', minWidth:80, align:'center'}
                    ,{field: 'createTime', title: '创建时间', minWidth: 60, align:'center',templet: function(d){
                            return d.createTime.replace('T', ' ').split(".")[0];
                        }}
                    ,{ title: '操作', toolbar:'#toolbar1', minWidth: 20, align:'center'}
                ]]
                // ,limit: 2
                ,parseData: function(res){ //res 即为原始返回的数据
                    console.log(res);
                    return {
                        "code": res.status, //解析接口状态
                        "msg": res.message, //解析提示文本
                        "count": res.total, //解析数据长度
                        "data": res.data //解析数据列表
                    };
                }
            });
            //头工具栏事件
            table.on('toolbar(competition_list)',
                function(obj) {
                    // var checkStatus = table.checkStatus(obj.config.id);
                    console.log(obj);
                    switch (obj.event) {
                        case 'delAll':
                            var checkStatus = table.checkStatus(obj.config.id);
                            var data = checkStatus.data;
                            var ids = [];
                            // 获取选中的id
                            data.forEach(function(el) {
                                ids.push(el.id)
                            });
                            if(ids.length < 1){
                                layer.alert('至少选择1条数据',{icon:5});
                            }else{
                                // console.log(ids)
                                layer.confirm('确认要删除这'+ids.length+'条数据吗？',function(index){
                                    //捉到所有被选中的，发异步进行删除
                                    var data={};
                                    data.ids=ids;
                                    util.sendPOST("/competition_del", data, function (reponse) {
                                        layer.msg('删除成功', {icon: 1});
                                        tablein.reload();
                                    }, function (reponse) {
                                        layer.msg('删除失败', {icon: 2});
                                    });

                                });
                            }

                            break;
                        case 'add':
                            xadmin.open('创建赛题','./competition_add.html',800,600,tablein);
                            break;
                        case 'refresh':
                            tablein.reload();
                            break;

                    }
                });
            //头工具栏事件
            table.on('tool(competition_list)',
                function(obj) {
                    // var checkStatus = table.checkStatus(obj.config.id);
                    console.log(obj);
                    switch (obj.event) {
                        case 'edit':
                            competition_data=obj.data;
                            xadmin.open('编辑','./competition_update.html',800,600,tablein);
                            break;
                        case 'modify':
                            xadmin.open('编辑','member-password.html',600,400);
                            break;
                        case 'del':
                            layer.confirm('确认要删除吗？',function(index){
                                //发异步删除数据
                                ids=[];
                                console.log(obj)
                                ids.push(obj.data.id);
                                var data={};
                                data.ids=ids;
                                util.sendPOST("/competition_del", data, function (reponse) {
                                    layer.msg('删除成功', {icon: 1});
                                    // tablein.reload();
                                    obj.del();
                                }, function (reponse) {
                                    layer.msg('删除失败', {icon: 2});
                                });
                            });
                            break;
                    };
                });
            $("#search").click(function () {
                var comp_name = $("#search_name").val();
                var data = {};
                data.user_name = comp_name;
                tablein.reload({
                    url:'/search_competition',
                    where:{
                        comp_name:comp_name
                    },
                    contenType:'application/json'
                });
            });
        });</script>

</html>